<!--
 * @Description: 系统日志
 * @Author: chendingfengmail@163.com
 * @Date: 2021-10-29 13:44:43
 * @LastEditTime: 2022-01-17 13:57:39
 * @LastEditors: chendingfengmail@163.com
 * @Reference: 
-->
<!-- 系统日志 -->
<template>
  <dd-container>
    <dd-card>
      <!-- 数据信息 -->
      <dd-table
        ref="sysLogTable"
        rowKey="code"
        :data="tableData"
        :option="option"
        :screen="searchForm"
        :loadingData="loadUserLogList"
        :tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
        <template slot="condition">
          <el-form-item label="IP地址">
            <el-input v-model="searchForm.ip" placeholder="请输入IP地址" clearable></el-input>
          </el-form-item>
          <el-form-item label="功能地址">
            <el-input v-model="searchForm.url" placeholder="请输入地址" clearable></el-input>
          </el-form-item>
          <el-form-item label="操作时间">
            <el-date-picker
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd HH:mm:ss"
              v-model="atime"
              type="daterange"
              size="small"
              start-placeholder="开始日期"
              range-separator="至"
              end-placeholder="结束日期">
            </el-date-picker>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" size="small" @click="onSearch" v-if="showButton($route.path, '查询')">查询</el-button>
          </el-form-item>
        </template>

        <template slot="operation">
          <el-form-item>
            <el-button type="search" size="small" @click="onSearch" v-if="showButton($route.path, '查询')">查询</el-button>
          </el-form-item>
          <el-form-item>
            <el-button type="add" size="small" @click="openDialog('add')" v-if="showButton($route.path, '新增')">新增</el-button>
          </el-form-item>
        </template>

        <el-table-column prop="user" label="操作用户" align="center" width="185"></el-table-column>
        <el-table-column prop="atime" label="操作时间" align="center" width="150"></el-table-column>
        <el-table-column prop="content" label="备注" align="center" width="200"></el-table-column>
        <el-table-column prop="ip" label="ip地址" align="center" width="150"></el-table-column>
        <el-table-column prop="url" label="功能地址" align="start" width="200"></el-table-column>
        <el-table-column prop="param" label="操作参数" align="center" width="150">
          <template slot-scope="scope">
            {{ scope.row.param && scope.row.param !== ''?  scope.row.param: '无'}}
          </template>
        </el-table-column>
      </dd-table>
    </dd-card>
  </dd-container>
</template>

<script>
import { mapState,mapGetters } from 'vuex';

export default {
  name: 'systemLog',
  data() {
    return {
      searchForm: {
        user: '',
        start: '',
        end: '',
        ip: '',
        enabled: '',
        level: 1,
        pageIndex: 1,
        pageSize: 15,
      },
      modelType: 'info',
      atime: [],
      modelData: {},
      tableData: [],
      option: {
        total: 0,
        loading: true,
        operation: true,
      },
    };
  },

  components: {},
  mounted() {
    this.loadUserLogList();
  },
  
  computed: {
    ...mapState('ddAdmin/user', ['info']),
    ...mapGetters('ddAdmin/menu', ['showButton'])
  },

  watch: {
    atime(val) {
      if (val) {
        this.searchForm.start = val[0].split(' ')[0] + ' 00:00:00';
        this.searchForm.end = val[1].split(' ')[0] + ' 23:59:59';
      } else {
        this.searchForm.start = this.$options.data().searchForm.start;
        this.searchForm.end = this.$options.data().searchForm.end;
      }
    },
  },

  methods: {
    onSearch() {
      this.searchForm.pageIndex = this.$options.data().searchForm.pageIndex;
      this.loadUserLogList();
    },
    // 加载日志信息
    async loadUserLogList() {
      try {
        if (this.info.username !== 'admin') {
          this.searchForm['user'] = this.info.username;
        }
        let bat = this.searchForm;
        if (bat.start == '') {
          delete bat['start'];
        }
        if (bat.end == '') {
          delete bat['end'];
        }

        this.searchForm['orderProp'] = 'atime';
        this.searchForm['order'] = 'desc';
        let count = await this.$api.userLog.findMax(this.searchForm);
        let param = this.searchForm;

        let result = await this.$api.userLog.findList(param);
        this.option.total = count.value;
        this.tableData = result.value;
        this.option.loading = false;
      } catch (error) {
        // console.log(error);
      }
    },
  },
};
</script>

<style lang='scss' scoped>
</style>